﻿<%@ Page Title="" Language="C#" MasterPageFile="~/EventsParent.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebFrontEnd.Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <link href="css/jquery.countdown.css" rel="stylesheet" />
    <script type="text/javascript" src="js/jquery.countdown.js"></script>
    <style type="text/css">
        .center {
            text-align:center;
        }
    </style>
    <script type="text/javascript">
        $(function () {
            var endDate = $("#<%Response.Write(startCount.ClientID);%>").data('date');
            $("#counter").countdown({
                date: endDate,
                render: function (data) {
                    var html = [];
                    if (data.years > 0) {
                        html.push(
                            "<div>",
                            this.leadingZeros(data.years, 2),
                            "<span>years</span></div>"
                         );
                    }
                    if (data.days > 0) {
                        html.push(
                            "<div>",
                            this.leadingZeros(data.days, 2),
                            "<span>days</span></div>"
                         );
                    }
                    html.push(
                        "<div>",
                            this.leadingZeros(data.hours, 2),
                            "<span>hrs</span></div>",
                            "<div>",
                            this.leadingZeros(data.min, 2),
                            "<span>min</span></div>",
                            "<div>",
                            this.leadingZeros(data.sec, 2),
                            "<span>sec</span></div>"
                        );
                    $(this.el).html(html.join(""));
                }
            });
        });
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="NavBar" runat="server">
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="MainContent" runat="server">
    <div class="hero-unit center">
         <h2>Hey <span runat="server" id="userNameLabel"></span>,</h2>
         <h1>Welcome back to YEMS!</h1>
    </div>
    <div class="row-fluid">
        <div class="span12 well">
            <h1><asp:Label ID="emptyEventLabel" runat="server" Text="You don't have events!"></asp:Label></h1>
            <div class="row-fluid center" id="nextEvDiv" runat="server">
                <div class="span5 page-header">
                    <h3 style="float:left;"><asp:Label runat="server" ID="nextEvLabel" Text="Your next event:"></asp:Label> &nbsp;&nbsp;&nbsp;<a runat="server" id="eventMainLink" href="#"></a></h3>                    
                </div>
                <div class="pull-right">
                  <span runat="server" id="startCount" style="display: none;"></span>
                  <div class="lead">
                      <span runat="server" id="eventNameSpan"></span>&nbsp;is in
                  </div>
                  <span id="counter" class="styled"></span>              
                </div>
            </div>
        </div>
    </div>
</asp:Content>
